<template>
	<van-popup :show="isShow" position="bottom" round @click-overlay="$emit('getClose')">
		<view class="p_font_28 p_text_c p_margin_t_64">支付总金额</view>
		<view class="p_font_64 p_text_c p_margin_t_16"><text class="p_font_40 p_margin_r_8">¥</text>{{priceNum}}</view>
		<view class="p_margin_t_40"></view>
		<view class="p_flex2" style="padding: 24rpx 32rpx;" v-for="(item, index) in wx?payWxList: payList" :key="index"
			@click.stop="getChooseType(index)">
			<image :src="item.icon" class="p_img_48 p_margin_r_16"></image>
			<view class="p_font_32 p_flex_1 p_flex2">
        {{item.title}}
        <view class="view-btn" v-if="showTbaoBtn && index === 1" @click.stop="handleView">介绍</view>
      </view>
			<image src="https://dy.sykj365.com/uploads/mini/xuanzhong@2x.png" class="p_img_48" v-if="payIndex == index"></image>
			<image src="https://dy.sykj365.com/uploads/mini/weixuanzhong@2x.png" class="p_img_48" v-else></image>
		</view>
		<view class="p_font_26 p_color_ff5555 p_lr_32">系统已经给予优惠了，电商平台不支持改小数点后面金额，下单将在以上价格上采取四舍五入</view>
		<view class="p_btn" @click="getPay">
			<view>确认付款</view>
		</view>
	</van-popup>
</template>

<script>
	export default {
		props: {
			isShow: {
				type: Boolean,
				default: false
			},
			priceNum: {
				type: String,
				default: ''
			},
			wx: {
				type: Boolean,
				default: false
			},
			order: {
				type: Boolean,
				default: false
			},
			isTaoBao: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				payIndex: 0,
				payList: [{
					icon: 'https://dy.sykj365.com/uploads/mini/weixin@2x.png',
					title: '微信支付'
				}, {
					icon: 'https://dy.sykj365.com/uploads/mini/taobao@2x.png',
					title: '淘宝支付'
				}, {
					icon: 'https://dy.sykj365.com/uploads/mini/pingduoduo@2x.png',
					title: '拼多多支付'
				}],
				payWxList: [{
					icon: 'https://dy.sykj365.com/uploads/mini/weixin@2x.png',
					title: '微信支付'
				}],
        showTbaoBtn: true,
        TbaoContent: '',
			}
		},
		watch: {
			isTaoBao(newVal, oldVal) {
				// 当 isTaoBao 发生变化时触发
				if(newVal){
					this.payList =  [{
						icon: 'https://dy.sykj365.com/uploads/mini/taobao@2x.png',
						title: '淘宝支付'
					}]
				}
			}
		},
		mounted() {
      this.$http.post(this.$api.image_info).then(res => {
        if (res.data.button === 1) {
          this.showTbaoBtn = true;
          this.TbaoContent = res.data.taobao_remark;
        } else {
          this.showTbaoBtn = false;
        }
      })
    },
		methods: {
      // 淘宝查看
      handleView() {
        uni.showModal({
          title: '淘宝支付',
          content: this.TbaoContent,
          showCancel: false,
          confirmText: '关闭'
        })
      },
			getChooseType(i) {				
				this.payIndex = i;
			},
			getPay() {
				this.$emit('getChoosePay', this.isTaoBao ? 1 : this.payIndex);
			},
			// 微信支付
			wxPay(o, type) {
				let self = this;
				this.$http.post(this.$api.pay, {
					order_num: o
				}).then(res => {
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: function() {
							if (type) {
								getApp().getMsg('支付成功', 'success');
								self.$emit('getWxPaySuccess', true);
							} else {
								uni.setStorageSync('set', true);
                uni.showModal({
                  title: '支付成功',
                  content: '你已成功下单，请等待平台打印发货',
                  showCancel: false,
                  confirmText: '查看订单',
                  success(res) {
                    uni.redirectTo({
                    	url: '/pages/my/order'
                    });
                  }
                })
								// uni.redirectTo({
								// 	url: '/pages/index/paySuccess?price=' + self.priceNum
								// });
								
							}
						},
						fail: function(err) {
							if (self.order) {
								getApp().getMsg('您放弃了支付');
								setTimeout(() => {
									uni.setStorageSync('set', true);
									uni.redirectTo({
										url: '/pages/my/order'
									});
								}, 1000)
							} else {
								getApp().getMsg('您放弃了支付');
							}

							// uni.setStorageSync('set', true);
							// getApp().getBack();
						}
					});
				})
			}
		}
	}
</script>

<style lang="scss">
	.p_btn {
		margin-top: 70rpx;
	}
  .view-btn {
    font-size: 24rpx;
    border: 1px solid $uni-color-primary;
    color: $uni-color-primary;
    margin-left: 12rpx;
    padding: 0 14rpx;
    line-height: 34rpx;
    border-radius: 6rpx;
  }
</style>